<template>
    <div>
        <ul class="clearfix patients-box">
            <van-list v-model="loading" :finished="finished" finished-text="没有更多了" @load="onLoad">
                <li class="patients-li clearfix b-g-f" v-for="(item,index) in list" :key="index" @click="link(item)">
                    <img class="patients-img" :src="item.avatar" alt="">
                    <div class="patients-name-box">
                        <span class="patients-name">{{item.user_nickname}}</span>
                        <span class="patients-order-num" v-if="mess">{{item.hospital_name}}</span>
                        <span class="patients-order-num" v-else>订单数：{{item.order_num}}</span>
                    </div>
                </li>
            </van-list>
        </ul>
    </div>
</template>
<script>
export default {
    data(){
        return{
            mess:this.$route.query.patientsTitle,
            list:[],
            page:0,
            loading:false,
            finished:false
        }
    },
    mounted(){
    },
    methods:{
        onLoad(){
            if(this.mess){
                this.myDietitianForFollow()
            }else{
                this.myPatients()
            }
        },
        // 我的患者列表
        myPatients(){
            this.page++
            this.$api.dietitian.myPatients({page:this.page}).then(resp =>{
                if(resp.code == 1){
                    this.loading = false
                    if(resp.data.length > 0){
                        resp.data.forEach(e=>{
                            this.list.push(e)
                        })
                    }else{
                        this.finished = true
                    }
                }
            })
        },
        // 我的营养师列表
        myDietitianForFollow(){
            this.page++
            this.$api.follow.myDietitianForFollow({page:this.page}).then(resp =>{
                if(resp.code == 1){
                    this.loading = false
                    if(resp.data.length > 0){
                        resp.data.forEach(e=>{
                            this.list.push(e)
                        })
                    }else{
                        this.finished = true
                    }
                }
            })
        },
        link(item){
            if(this.$route.query.patientsTitle){
                this.$router.push({
                    name:'dietitian',
                    query:{
                        id:item.id
                    }
                })
            }else{
                this.$router.push({
                    name:'patients',
                    query:{
                        id:item.id,
                        imgPath:item.avatar,
                        name:item.user_nickname
                    }
                })
            }
        }
    }
}
</script>

<style lang="less" scoped>
.patients-box{
    margin-top: 30px;
    .patients-li{
        background-image: url('../../../static/img/you.png');
        background-repeat: no-repeat;
        background-position: center right 30px;
        padding: 25px 40px;
        border-bottom:solid 1px #f5f5f5;
        background-size: 20px;
        .patients-img{
            width: 171px;
            height: 171px;
            float: left;
            border-radius: 50%;
        }
        .patients-name-box{
            margin-left: 200px;
            span{
                display: block;
            }
            .patients-name{
                padding-top: 25px;
                font-size: 40px;
            }
            .patients-order-num{
                line-height: 80px;
                font-size: 34px;
                color: #888;
            }
        }
    }
}
</style>

